<template>
  <div class="demo">
    <div class="demo-title">不区分大小写</div>
    <div class="demo-content">
      <AutoComplete
        v-model:value="value"
        :options="options"
        style="width: 200px"
        placeholder="input here"
        :filter-option="filterOption"
      />
    </div>
  </div>
</template>

<script lang="ts" setup>
  import { ref } from 'vue';
  import AutoComplete from '@sscd/auto-complete';
  interface Option {
    value: string;
  }
  const value = ref('');
  const options = ref<Option[]>([
    { value: 'Burns Bay Road' },
    { value: 'Downing Street' },
    { value: 'Wall Street' },
  ]);
  const filterOption = (input: string, option: Option) => {
    return option.value.toUpperCase().indexOf(input.toUpperCase()) >= 0;
  };
</script>
